// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Security Dashboard default states sets up group-level 1`] = `
<div>
  <div>
    <h2
      class="gl-mb-6"
    >
      Security dashboard
    </h2>
    <div
      class="security-charts gl-display-grid"
    >
      <section
        class="gl-border-solid gl-rounded-base gl-border-1 gl-border-gray-100 gl-display-flex gl-flex-direction-column"
      >
        <header
          class="gl-p-5"
        >
          <h4
            class="gl-mt-0 gl-mb-3"
            data-testid="title"
          >
    Vulnerabilities over time
          </h4>
          <p
            class="gl-text-secondary gl-m-0"
            data-testid="help-text"
          >
    June 6th to today
          </p>
          <div
            class="gl-mt-5"
            data-testid="controls"
          >
            <div
              class="gl-display-flex btn-group"
              role="group"
            >
              <button
                class="btn btn-default btn-md gl-button selected"
                type="button"
              >
                <span
                  class="gl-button-text"
                >
    30 Days
                </span>
              </button>
              <button
                class="btn btn-default btn-md gl-button"
                type="button"
              >
                <span
                  class="gl-button-text"
                >
    60 Days
                </span>
              </button>
              <button
                class="btn btn-default btn-md gl-button"
                type="button"
              >
                <span
                  class="gl-button-text"
                >
    90 Days
                </span>
              </button>
            </div>
          </div>
        </header>
        <div
          class="gl-spinner-container gl-my-12"
          role="status"
        >
          <span
            aria-label="Loading"
            class="gl-vertical-align-text-bottom! gl-spinner gl-spinner-dark gl-spinner-lg"
          />
        </div>
      </section>
      <section
        class="gl-border-solid gl-rounded-base gl-border-1 gl-border-gray-100 gl-display-flex gl-flex-direction-column"
      >
        <header
          class="gl-p-5"
        >
          <h4
            class="gl-mt-0 gl-mb-3"
            data-testid="title"
          >
    Project security status
          </h4>
          <p
            class="gl-text-secondary gl-m-0"
            data-testid="help-text"
          />
        </header>
        <div
          class="gl-spinner-container gl-my-12"
          role="status"
        >
          <span
            aria-label="Loading"
            class="gl-vertical-align-text-bottom! gl-spinner gl-spinner-dark gl-spinner-lg"
          />
        </div>
      </section>
    </div>
  </div>
</div>
`;

exports[`Security Dashboard default states sets up instance-level 1`] = `
<div>
  <div>
    <h2
      class="gl-mb-6"
    >
      Security dashboard
    </h2>
    <div
      class="security-charts gl-display-grid"
    >
      <section
        class="gl-border-solid gl-rounded-base gl-border-1 gl-border-gray-100 gl-display-flex gl-flex-direction-column"
      >
        <header
          class="gl-p-5"
        >
          <h4
            class="gl-mt-0 gl-mb-3"
            data-testid="title"
          >
    Vulnerabilities over time
          </h4>
          <p
            class="gl-text-secondary gl-m-0"
            data-testid="help-text"
          >
    June 6th to today
          </p>
          <div
            class="gl-mt-5"
            data-testid="controls"
          >
            <div
              class="gl-display-flex btn-group"
              role="group"
            >
              <button
                class="btn btn-default btn-md gl-button selected"
                type="button"
              >
                <span
                  class="gl-button-text"
                >
    30 Days
                </span>
              </button>
              <button
                class="btn btn-default btn-md gl-button"
                type="button"
              >
                <span
                  class="gl-button-text"
                >
    60 Days
                </span>
              </button>
              <button
                class="btn btn-default btn-md gl-button"
                type="button"
              >
                <span
                  class="gl-button-text"
                >
    90 Days
                </span>
              </button>
            </div>
          </div>
        </header>
        <div
          class="gl-spinner-container gl-my-12"
          role="status"
        >
          <span
            aria-label="Loading"
            class="gl-vertical-align-text-bottom! gl-spinner gl-spinner-dark gl-spinner-lg"
          />
        </div>
      </section>
      <section
        class="gl-border-solid gl-rounded-base gl-border-1 gl-border-gray-100 gl-display-flex gl-flex-direction-column"
      >
        <header
          class="gl-p-5"
        >
          <h4
            class="gl-mt-0 gl-mb-3"
            data-testid="title"
          >
    Project security status
          </h4>
          <p
            class="gl-text-secondary gl-m-0"
            data-testid="help-text"
          />
        </header>
        <div
          class="gl-spinner-container gl-my-12"
          role="status"
        >
          <span
            aria-label="Loading"
            class="gl-vertical-align-text-bottom! gl-spinner gl-spinner-dark gl-spinner-lg"
          />
        </div>
      </section>
    </div>
  </div>
</div>
`;

exports[`Security Dashboard error states has unavailable pages 1`] = `
<div>
  <section
    class="gl-display-flex empty-state gl-text-center gl-flex-direction-column"
  >
    <div
      class="gl-max-w-full"
    >
      <div
        class="svg-250 svg-content"
      >
        <img
          alt=""
          class="gl-max-w-full gl-dark-invert-keep-hue"
          role="img"
          src="/test/empty_state.svg"
        />
      </div>
    </div>
    <div
      class="gl-max-w-full gl-m-auto"
      data-testid="gl-empty-state-content"
    >
      <div
        class="gl-mx-auto gl-my-0 gl-p-5"
      >
        <h1
          class="gl-font-size-h-display gl-line-height-36 h4"
        >
          Oops, something doesn't seem right.
        </h1>
        <p
          class="gl-mt-3"
        >
          Either you don't have permission to view this dashboard or the dashboard has not been setup. Please check your permission settings with your administrator or check your dashboard configurations to proceed.
        </p>
        <div
          class="gl-display-flex gl-flex-wrap gl-justify-content-center"
        >
          <a
            class="btn gl-mb-3 btn-confirm btn-md gl-button gl-mx-2"
            href="/help/user/application_security/configuration/index"
          >
            <span
              class="gl-button-text"
            >
              Learn more about setting up your dashboard
            </span>
          </a>
        </div>
      </div>
    </div>
  </section>
</div>
`;
